<template>
	<view class="editPw">
		<view class="input_pw">
			<input v-model.trim="oldPwd" placeholder-class="placeStyle" placeholder="请输入原密码" maxlength="16" type="password" />
		</view>
		<view class="input_pw mt">
			<input v-model.trim="newPwd" placeholder-class="placeStyle" placeholder="请输入新密码" maxlength="16" type="password" />
		</view>
		<view class="input_pw">
			<input v-model.trim="newPwd1" placeholder-class="placeStyle" placeholder="确认密码" maxlength="16" type="password" />
		</view>

		<view class="biding_btn bold" @click="editPassword">确认修改</view>
	</view>
</template>

<script>
	import { baseUtils } from '../../utils/base.js';
	export default {
		data() {
			return {
				oldPwd:'',
				newPwd:'',
				newPwd1:'',
			};
		},
		methods:{
			//修改密码
			editPassword(){
				const _this = this;
				if(_this.oldPwd == ''){
					return _this.$showToast('请输入您的旧密码～');
				}
				if(_this.newPwd == ''){
					return _this.$showToast('请输入您的新密码～');
				}
				if(!baseUtils.$exp.pw.test(_this.newPwd)){
					return _this.$showToast('请输入8-20之间非纯数字密码～');
				}
				if(_this.newPwd != _this.newPwd1){
					return _this.$showToast('两次输入的新密码不一致～');
				}
				_this.doEidtAxios();
			},
			//去修改
			async doEidtAxios(){
				const _this = this;
				let res = (await _this.$http('/api/auth/user/modifyPwd','POST',{
					oldPwd:_this.oldPwd,
					newPwd:_this.newPwd
				})).data;
				if(res && res.code == '0'){
					_this.$showToast('密码修改成功，请重新登录哦～');
					setTimeout(()=>{
						_this.$relTo('../login/login');
					},1000);
				}else{
					_this.$showToast(res.msg);
				}
			}
		}
	}
</script>

<style lang="scss" scoped>
	.editPw{
		width: 100%;
		min-height: 100vh;
		background-color: #F6F6F6;
		.input_pw{
			background-color: #fff;
			border-top: solid 1rpx #F6F6F6;
			padding: 32rpx 24rpx;
			&.mt{
				margin-top: 24rpx;
			}
		}

		.biding_btn{
			width: 606rpx;
			height: 88rpx;
			background-color: $ych_color;
			border-radius: 12rpx;
			font-size: 30rpx;
			color: #fff;
			@include flex_center;
			margin:107rpx auto;
			@include box_shadow_btn;
		}
	}
</style>
